<%@ page language="java" pageEncoding="UTF-8"
	contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<!-- saved from url=(0048)http://www.xiami.com/song/showcollect/id/2084514 -->
<html lang="zh-CN"><!--<![endif]--><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta charset="UTF-8">
	<title>流派集</title>
	
	<meta name="verify-v1" content="gNntuhTm2rH7Qa/GPp6lf0mIp9KQsjejNs+i1LZhG7U=">
	<meta name="keywords" content="吉他玩得相当棒的音乐">
	<meta name="description" content="吉他玩得相当棒的音乐">	<meta property="og:site_name" content="虾米音乐网">
		
		<link href="http://st.xiami.com/??res/v3/css/global.css,res/v3/css/login.css?20120218" rel="stylesheet" media="all">
		<link href="http://st.xiami.com/??res/css/default/main15.css,res/css/default/mode15.css" media="screen" rel="stylesheet">
<link href="http://st.xiami.com/??res/css/default/group15.css,res/css/default/beta15.css,res/v3/css/music.css?20110105" media="screen" rel="stylesheet">

	<link href="images/icon.gif" type="image/x-icon" rel="shortcut icon">
	<link href="http://img.xiami.com/res/img/common/ipad/xiami_logo_apple.png" rel="apple-touch-icon">
	<link href="http://www.xiami.com/opensearch.xml" type="application/opensearchdescription+xml" rel="search" title="Xiami Search">
	<link rel="alternate" type="application/atom+xml" title="虾米音乐每日精选" href="http://www.xiami.com/collect/feed">
	<!--[if lte IE 8]>
	<link href="http://st.xiami.com/res/v3/css/login_iefix.css?ver=2010122901" rel="stylesheet" media="all" />
	<![endif]-->
		<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript">
function searchBlur(who){
	if(who.value == ''){
		who.value = '搜索音乐，寻找好友';
		who.parentNode.className = '';
	}
}
function searchFocus(who){
	if(who.value == '搜索音乐，寻找好友'){
		who.value = '';
		who.parentNode.className = 'highlight';
	}
}
var mId,mTitle;
function add() {
	$.ajax( {
		url : "mark!listen.action",
		type : "POST",
		data : {
		    id : $("#music_id").html()
		},
		dataType : "json",
		success : function(data) {
			$("#music_listen").html(data.listen + "");
			$("#music_listen").append("<span>试听</span>");
		}
	});
}



function showAddList(title,id){
	mId = id;
	mTitle = title;
	select(0);
}
function closedialog(){
	$('#addList').hide();
	$('#login_popup').hide();
}
function select(i){
	if(i == 0){
		getList();
	}else{
		$('#addList').show();
		$('ul[class="tabs"]> li').removeClass('current');
		$('ul[class="tabs"]> li').eq(1).addClass('current');
		$('div[class="add_clt_main popup_tabitem"]').hide();
		$('div[class="clt_creat_Q popup_tabitem"]').show();
	}
}

function addList(){
	name = $('#clt_name')[0].value;
	des = $('#clt_des')[0].value;
	$.ajax( {
		url : "addListAjax!add.action",
		type : "POST",
		data : {
			listname : name,
			listdescription : des,
		},
		dataType : "json",
		success : function(data){
			if(data.flag == "1"){
				select(0);
			}else{
				alert(data.flag);
			}
		}
	});	
}

function getList(){
	$('ul[class="lists"]').html('');
	$.ajax( {
		url : "addListAjax!get.action",
		type : "POST",
		data : {},
		dataType : "json",
		success : function(data){
			if(data.flag == "没有登录"){
				$('#login_popup').show();
			}else{
				$('#addList').show();
				$.each(data.lists, function(index, value) {
				$('ul[class="lists"]').append('<li><input type="radio" value="'+value.sourceId+'" name="list_id" checked="">'+value.sourceName+'</li>');
				$('div[class="add_clt_main popup_tabitem"]').show();
				$('div[class="clt_creat_Q popup_tabitem"]').hide();
				$('ul[class="tabs"]> li').removeClass('current');
				$('ul[class="tabs"]> li').eq(0).addClass('current');
				});
			}
		}
	});	
}

function addToList(){
	lId=$('input:radio[name="list_id"]:checked').val();
	$.ajax( {
		url : "addToList!add.action",
		type : "POST",
		data : {
			listId:lId,
			musicId:mId
		},
		dataType : "json",
		success : function(data){
			if(data.flag == "0"){
				alert("亲，您忘了您已经添加过了啊");
				closedialog();
			}else{
				closedialog();
			}
		}
	});	
}
function login(){
	$.ajax( {
		url : "loginAjax",
		type : "POST",
		data : {
			username : $('#username')[0].value,
			password : $('#password')[0].value
		},
		dataType : "json",
		success : function(data){
			if(data.flag == 1){
				$('#login_popup').hide();
			}else{
				$('#login_tips').html('用户名或密码错误');
			}
		}
	});
}
function playMusic(src){
	console.log(src);
	            // Check for audio element support.
        if (window.HTMLAudioElement) {
            try {
                var oAudio = document.getElementById('mAudio');
                //console.log(oAudio.src);
                // Tests the paused attribute and set state. 
                if (oAudio.paused) {
                	oAudio.src = "/ShareMusicProject" + src;
                    oAudio.play();
                    //document.getElementById('playIndicator').innerHTML = '立刻暂停';
                }
                else {
                    oAudio.pause();
                    //document.getElementById('playIndicator').innerHTML = '立刻播放';
                }
            }
            catch (e) {
                // Fail silently but show in F12 developer tools console
                 if(window.console && console.error("Error:" + e));
            }
        }
}
function showHidden(){$('div[class="more_drop hidden"]').removeClass('hidden')}
function playsongs(type){
	$('#playType')[0].value = type;
	window.open("musicPlayer.htm", "newwindow", "height=355, width=630, top=0,left=0,toolbar=no, menubar=no");
}
</script>
</head>
<body>
<input type="hidden" id="playType" value=1/>
<div id="addList" style="display: none;">
<div style="height: 100%; width: 100%; position: fixed; left: 0px; top: 0px; z-index: 99998; opacity: 0.5; " class="jqmOverlay"></div>
<div id="dialog_clt" class="dialog_popup jqmID1" style="z-index: 99999; display: block; left: 709px; top: 68px; ">
	<div class="dialog_main"><h3>将 <span id="mTitle"></span>添加到精选集</h3>
<div class="dialog_content">
	<div class="dlg_clt">
		<ul class="tabs">
			<li class="current"><a href="javascript:select(0);" title="">选择精选集</a></li>
			<li ><a href="javascript:select(1);" title="">创建新的精选集</a></li>
		</ul>
		<div class="add_clt_main popup_tabitem"> 			<form action="/song/collect" method="POST" id="form_collect_lists">
				<input type="hidden" name="music_id" id="music_id" value="">
								<ul class="lists">
										<li>
						<input type="radio" value="11740358" name="list_id" checked="">
						阿斯蒂芬 </li>
										<li>
						<input type="radio" value="2665537" name="list_id">
						默认精选集 </li>
										
									</ul>
				<p class="acts">
					<input type="button" onclick="addToList();" class="bt_sub2" name="submit" value="保 存">
					&nbsp;&nbsp;&nbsp;
					<input type="button" class="bt_cancle2" value="取 消" onclick="closedialog();">
				</p>
			</form>
			 </div>
			<div class="clt_creat_Q popup_tabitem" style="display:none">
				<input type="hidden" name="song_id" value="1770934562">
				<p>
					<label class="for_label" for="clt_name">流派集名称：</label>
					<input type="text" class="f_txt" id="clt_name" name="listName">
				</p>
				<p>
					<label class="for_label" for="clt_des">流派集介绍：</label>
					<textarea cols="40" rows="5" id="clt_des" name="listDescription"></textarea>
				</p>
<!-- 
				<p id="validate_code">
					<label  class="for_label" for="validate">验证码：</label>
					<input type="text"  id="validate" class="txt_input r3px" maxlength="4" name="validate" value=""  style="width:50px;" />
					<img src="/coop/checkcode" height="50" align="top"/>
					<span class="hint" style="display:block;margin-left:144px;">输入上述等式结果</span> </p>
				</p>
 -->
				<p class="acts">
					<input type="button" onclick="addList();" name="submit" class="bt_sub2" value="保 存">
				</p>
		</div>
	</div>
</div>
<a class="Closeit" href="javascript:;" title="" onclick="closedialog();">关闭</a> 


 
</div>
	<div class="dialog_sharp">
		<div class="dialog_sharp_top"></div>
		<div class="dialog_sharp_bottom"></div>
	</div>
	<div class="jqDrag"></div>
</div></div>
<div id="login_popup" style="display: none;">
<div style="height: 100%; width: 100%; position: fixed; left: 0px; top: 0px; z-index: 99998; opacity: 0.5; " class="jqmOverlay"></div>
<div id="dialog_clt" class="dialog_popup jqmID1" style="z-index: 99999; display: block; left: 709px; top: 68px; ">
<div class="dialog_main" style="width: 320px"><h3>登录</h3>
<div class="dialog_content">
	<div class="dlg_clt">
			<div class="clt_creat_Q popup_tabitem"  style="margin-left: 20px;margin-right: 20px;font-size: 32px;">
				<input type="hidden" name="song_id" value="1770934562">
				<span id="login_tips"></span>
				<p>
					<label class="for_label" for="clt_name">登录用户名：</label>
					<input type="text" class="f_txt" id="username" name="username">
				</p>
				<p>
					<label class="for_label" for="clt_des">登录密码：</label>
					<input type="password" style="margin-left:11px" id="password" class="f_txt" name="password"/>
				</p>
				<p class="acts">
					<input type="button" onclick="login();" class="bt_sub2" value="登录">
					<input type="button" class="bt_cancle2" value="取 消" onclick="closedialog();">
				</p>
		</div>
	</div>
</div>
</div>
</div> 
</div>
<div id="xiami-content"><h1>吉他玩得相当棒的音乐</h1></div>
<audio id="mAudio"></audio>


<div id="n_header" style="background-image: none;"> 
	<!--usr-->
	<div id="n_header_line" style="border-bottom:0px;">
	<div class="n_header_inner">
		<a href="/ShareMusicProject/">
			<img title="享受音乐  享受快乐"  alt="" src="images/xiang-4.gif" width="102" height="42" style="float: left;padding-top:3px;">
			</a>
			<form action="" method="post" role="search" id="search_box" class="">
			<input type="text" autocomplete="off" id="search_query" name="title" value="搜索你想听的音乐...." title="搜索你想听的音乐...." onblur="searchBlur(this);" onClick="searchFocus(this);">
			<input type="submit" id="search_btn" class="" title="搜索" value="">
			<input type="hidden" value="1" name="pos">
			</form>
			<ul  style="margin:10px 0 0 10px;list-style:none;float:left;font-size:14px;">
			    <li style="float: left;padding-left:20px;"><a style="color:black;font-weight:bold; text-decoration: none;" title="首页" href="/ShareMusicProject/">首页</a></li>
				<li style="float: left;padding-left:20px;"><a style="color:black;font-weight:bold;Text-decoration:none;" title="发现音乐" href="/ShareMusicProject/allFind.jsp">发现音乐</a></li>
				<li style="float: left; padding-left:20px;"><a style="color:black;font-weight:bold;Text-decoration:none;"  title="分享音乐" href="/ShareMusicProject/findMusic.jsp">分享音乐</a></li>
			</ul>
			<div id="auto_complete" class="old hidden"></div>
			<s:if test="%{#session.user==null}">
				        		<div class="xUser_unlog" style="right: 22px;position: absolute;margin-top: 10px;">
        			<span class="log_orginal"><a href="./register.jsp" >免费注册</a><em>-</em><a href="./login.jsp" ><strong>登录</strong></a></span>
        		</div>

			</s:if>
			<s:else>
				<div class="xUser_logged" style="right: 3px;position: absolute;width:155px;">
		          <ul class="xUser_tabs clearfix">
		            <li><a class="uico_lbry"  href="./my_music.jsp" title="我的音乐库"><i>我的音乐库</i></a></li>
		            <li><a class="uico_collect"  href="./my_lists.jsp" title="我的精选集"><i>我的精选集</i></a></li>
		            <li><a class="uico_home"  href="/ShareMusicProject/home.action?id=${session.user.id}" title="我的个人主页"><img class="r3px" src="./allList_files/usr50.gif" width="16" height="16" alt="我的个人主页"></a></li>
		            <li class="u_more PxRlt"><a class="uico_more"  href="javascript:;" title="更多"><i>更多</i></a>
		              <div class="more_drop hidden">
		                <div class="more_dropInn"><a  href="logOut();">登出</a></div>
		              </div>
		            </li>
		          </ul>
		        </div>
			</s:else>
		</div>
	</div>
	<img src="images/ban.gif" style="background-repeat: repeat-x;height:4px; width:1500px;"/>
	
	<!--shine-->
	
</div>
<div id="page" class="old">
<div id="wrapper" class="clearfix">


<div id="am_tip" class="slidetip">
	<div>
		<strong>Am精选集 = 一段心情故事 + 几首歌曲 + 简短附注；制作属于你的精选集，随时随地想听就听</strong>
		<span><a href="javascript:;" onclick="sinaLogin();return false;"><img src="./allList_files/weibo2.png" alt="开始制作"></a></span>
	</div>
</div>




<div id="s_top">
	<h2 style="font-size: 16px;"><a href="/ShareMusicProject/home?id=${user.id}" title="${user.nickname}">${user.nickname}</a>的流派集&nbsp;&nbsp;/&nbsp;&nbsp;${playList.title}</h2>
</div>
<div id="ui-m2" class="clearfix">
	<!--left start-->
	<div id="element_l" style="width:630px;">
		<div id="info_collect">
			<div class="clearfix">
			<p class="cover" id="cover_logo"><span>  <a href="" target="_blank"><img src="${playList.avatar}" alt="吉他玩得相当棒的音乐"></a>  </span></p>
			<div class="info_collect_main">
				<h2>${playList.title}</h2>
				<div class="cdinfo">
					<ul>
						<li><span>创建人：</span><a href="/ShareMusicProject/home?id=${user.id}" title="">${user.nickname}</a></li>
						<li><span>歌曲数：</span>${count}</li>
						<li><span>创建时间：</span>${playList.time}</li>
						<li><span>专辑描述：</span>${playList.description}</li>
					</ul>
				</div>
			
			<style>
			.fr em.report{font-style:normal;}
			.fr em.report a:link,.fr em.report a:visited{color:#aaa;}
			#edit_bars div.fr em.report a:hover{color:red;}
			#album_acts {margin-top:10px;}
			.reportw{position:relative;}
			.reportt{position:absolute;left:0;top:50%;margin-top:-8px;z-index:9999;}
			.reportt a{color:#999;}
			</style>
			
									
				</div>
				</div>
			<div id="album_acts" class="clearfix">
				<div class="cd2play">
					<a onclick="playsongs(1)" title="点击播放" href="javascript:void(0);">点击播放</a>
				</div>
				
			</div>
			<div class="reportw">
		</div>
			 </div>
		<!--精选集信息 end-->
		<!--曲目列表 start-->
		<div id="list_collect">
			<div class="chapter_act">
				<p><a class="cd_play" href="javascript:playsongs(1);" title="">试听整张流派集</a></p>
			</div>
			<div class="chapter">
				<h3>全部曲目(${count})</h3>
				<div class="quote_song_list">
					<ul>
					<s:iterator value="#request.music" id="music" status="i">
				        <li class="totle_up" id="totle_3070252" data-source="<s:property value="#music.path" />" data-name="<s:property value="#music.title" />" data-img="<s:property value="#music.image" />">
							<div class="Qsong_item" id="order_1">
								<div class="s_info"> 
									<span class="chk">
										<input checked="true" type="checkbox" id="ra1" name="ids" value="3070252">
									</span> 
									<span class="trackid">
									    <s:if test="#i.index+1 < 10">
									        0<s:property value="#i.index+1"/>
									    </s:if>
									    <s:else>
									        <s:property value="#i.index+1"/>
									    </s:else>
									</span>
									<span class="song_name"> 
										<a href="/ShareMusicProject/music?id=<s:property value="#music.id" />" title="<s:property value="#music.title" />"><s:property value="#music.title" /></a>
									</span>
									<p> 
										<a class="song_play" href="javascript:playMusic('<s:property value="#music.path" />')" title="试听" onclick="viod();">试听</a> 
										<a class="song_toclt" href="javascript:showAddList('','<s:property value="#music.id" />');" title="添加" title="">添加</a> 
									</p>
								</div>
								<div class="s_quote" style="width: 800px;">
									<span>
									    <em class="time">分享时间：<s:property value="#music.uploadTime" /></em>
									    <em class="words">&nbsp;&nbsp;&nbsp;&nbsp;歌曲描述：<strong id="des_8088768" style="font-weight:normal;"><s:property value="#music.description" /></strong></em>										  
									</span>
								</div>
							</div>
						</li>
					</s:iterator>
					</ul>
				</div>
			</div>
			<div class="chapter_ctrl cd_count">
	<div class="ctrl_play"> <a class="bt_choose" href="javascript:void(0)" title="" onclick="selectAll(&#39;ids&#39;)"><span>全选</span></a> <a class="bt_choose" href="javascript:void(0);" onclick="inverse(&#39;ids&#39;);" title=""><span>反选</span></a> <a class="bt_play" href="javascript:playsongs(0);" title=""><span>播放勾选歌曲</span></a> </div>
	</div>
 		</div>



	</div>
	<!--left end-->
	<!--right start-->
	<div id="element_r" style="width:300px;">
						<div id="user_collect" class="blank20 clearfix collect_right">
			<h3 class="Btitle">${user.nickname}的其它流派集</h3>
			<div class="common_sec">
				<ul>
					<s:iterator value="#request.otherPlayList" id="playList">
					    <li>
						<div class="collect_item2">
							<p class="cover"><a href="/ShareMusicProject/playList?id=<s:property value="#playList.sourceId" />"><img src="<s:property value="#playList.sourceImage" />" height="55" width="55"></a></p>&nbsp;&nbsp;&nbsp;
							<a href="/ShareMusicProject/playList?id=<s:property value="#playList.sourceId" />" title="<s:property value="#playList.sourceName" />"><strong><s:property value="#playList.sourceName" /></strong><span></span></a> <b class="ico_cd ele_inline"><a href="javascript:void(0)" title="试听" onclick="playcollect(&#39;2058891&#39;)">试听</a></b>
							<p>&nbsp;&nbsp;&nbsp;<s:property value="#playList.number" />首歌</p>
							<p class="time">&nbsp;&nbsp;&nbsp;<s:property value="#playList.time" /></p>
						</div>
					    </li>
					</s:iterator>
				</ul>
			</div>
			<span class="x_more"><a href="javascript:void();" onclick="void();" title="更多">更多</a></span> </div>
		 
		</div>

	<!--right end-->
</div>
<!--content end-->



</div>
</div>
<div id="footer">
		<div id="foot_wrap" class="clearfix">
		<p class="fl vam gray" id="follow_xiami">关注享乐： 
		<a href="javascript:;" title="新浪微博" rel="nofollow"><i class="social_gray sina"></i></a>
		<a href="javascript:;" title="人人网" rel="nofollow"><i class="social_gray renren"></i></a>
		<a href="javascript:;" title="QQ 空间" rel="nofollow"><i class="social_gray qzone"></i></a>
		<a href="javascript:;" title="腾讯微博" rel="nofollow"><i class="social_gray qqt"></i></a>
		<a href="javascript:;" title="搜狐微博" rel="nofollow"><i class="social_gray sohu"></i></a>
		<a href="javascript:;" title="豆瓣" rel="nofollow"><i class="social_gray douban"></i></a>
		
		</p>
		<p id="copyright" class="fr" style="margin-left: 10px;">
		<img src="images/bottom.gif"/>
		<p style="float: right;">©2012 <a href="/ShareMusicProject">享乐网</a></p>
		</p>
		</div>
</div> <!-- #foot_wrap -->
</body></html>